<template>
  <main>
    <van-cell-group class="discount">
      <van-cell title="（获取当前定位）" @click="setCity('')">
        <template #icon >
          <i class="iconfont icon-address_icon"></i>
        </template>
      </van-cell>
      <van-cell :title="item" v-for="item in cityList" :key="item" @click="setCity(item)">
        <template #right-icon v-if="item == selectCity">
          <i class="iconfont icon-right"></i>
        </template>
      </van-cell>
    </van-cell-group>
  </main>
</template>

<script>
import {mapGetters, mapActions} from 'vuex'
import * as Api from 'api'

export default {
  data() {
    return {
    }
  },
  computed: {
    ...mapGetters([
      'cityList',
      'selectCity'
    ])
  },
  created() {
    this.$emit('showTabMenu', false);
    if (!this.cityList.length) {
      this.getCityList()
    }
  },
  methods: {
    ...mapActions([
      'SetCityList',
      'SetSelectCity'
    ]),
    getCityList() {
      Api.CityList().then(res => {
        this.SetCityList(res.data)
      })
    },
    setCity(item) {
      this.SetSelectCity(item)
      history.go(-1)
    },
  }
}
</script>

<style scoped lang="less">
.icon-right{
  font-size: 14px;
  color: red;
}
</style>
